<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>云端记事本</title>
</head>
<body>
    <div id="app">
        <h1>云端记事本</h1>
        <div id="user" v-if="!user.isLogin">
            <ul class="tabs">
                <li>
                    <input type="radio"
                           name="tab-user"
                           id="tabLogin"
                           value="login" 
                           v-model="checked" />
                    <label for="tabLogin">用户登录</label>
                    <user-login v-model="user" v-if="checked === 'login'" />
                </li>

                <li>
                    <input type="radio"
                           name="tab-user"
                           id="tabSign"                           
                           value="sign" 
                           v-model="checked" />
                    <label for="tabSign">用户注册</label>
                    <user-sign-up v-if="checked === 'sign'" /> 
                </li>
            </ul>
        </div>
        <div id="notes" v-if="user.isLogin">
            <note-list :uid="user.data.uid"></note-list>
        </div>
    </div>
</body>
</html>
